<template>
  <div>
    <van-nav-bar
      :title="userinfo.isTitle ? '登录' : '注册'"
      left-arrow
      @click-left="$router.back()"
    >
      <template #right>
        <van-icon name="ellipsis" size="18" />
      </template>
    </van-nav-bar>
    <img src="../../assets/logo.png" style="width: 100px" alt="" />
    <van-form>
      <van-cell-group inset>
        <van-field
          v-model="userinfo.username"
          name="手机号"
          label="手机号"
          placeholder="手机号"
          :rules="[{ required: true, message: '请填写手机号' }]"
        />
        <van-field
          v-model="userinfo.password"
          type="password"
          name="密码"
          label="密码"
          placeholder="密码"
          :rules="[{ required: true, message: '请填写密码' }]"
        />
      </van-cell-group>
      <div style="display: flex; width: 100%; margin-top: 10px">
        <div class="identify">验证码</div>
        <input type="text" placeholder="验证码" v-model="identifyVal" />
        <div class="code" @click="refreshCode" style="width: 112px">
          <Identify></Identify>
        </div>
      </div>
      <p
        v-text="userinfo.isTitle ? '立即登录' : '已有账号,立即登录 '"
        @click="ontitle"
      ></p>
      <van-button
        type="success"
        @click="submit"
        v-text="userinfo.isTitle ? '登录' : '注册'"
      ></van-button>
    </van-form>
  </div>
</template>
<script setup>
import { reactive } from "vue";
import { useRouter } from "vue-router";
import ldentify from "../../components/ldentify.vue";
let router = useRouter();
let userinfo = reactive({
  username: "",
  password: "",
  isTitle: true,
});
// let onClickLeft=()=>{
//    router.back()
// }
let submit = () => {
  console.log(1);
};
let ontitle = () => {
  userinfo.isTitle = !userinfo.isTitle;
};
</script>
<style>
</style>